// 实现页面的访问控制
// import { getUserInfo } from './api/user'
import router, { asyncRoutes } from './router'
import store from './store'
import NProgress from 'nprogress' // progress bar
import 'nprogress/nprogress.css' // progress bar style
// import { getToken } from '@/utils/auth' // get token from cookie
// import getPageTitle from '@/utils/get-page-title'

// NProgress.configure({ showSpinner: false }) // NProgress Configuration

const whiteList = ['/login', '/404'] // no redirect whitelist

router.beforeEach(async(to, from, next) => {
  // 开启进度条
  NProgress.start()
  // 判断是否有token-- vuex
  if (store.getters.token) {
    if (to.path === '/login') {
      console.log('已经登录，不能再去登录')
      next('/')
      // 如果next(指定地址)跳转页面，那么不会再执行
      NProgress.done()
    } else {
      console.log('已经登录，放行')
      // 获取用户信息，存储到vuex
      // 判断vuex中是否存储了用户信息
      if (!store.getters.userId) {
        // 根据权限信息，动态的添加路由
        // 1.获取用户的权限信息
        // 2.根据权限筛选动态路由
        // 3.动态添加路由
        const { roles } = await store.dispatch('user/getInfo')
        console.log(asyncRoutes, 'asyncRoutes')
        const filterList = asyncRoutes.filter((item) => {
          return roles.menus.includes(item.children[0].name)
        })
        // 把筛选的路由列表，尾部追加404的路由，再使用router.addRoutes动态添加
        filterList.push({ path: '*', redirect: '/404', hidden: true })
        // 一旦使用了 addRoutes,那么需要使用next(topath)再次进入到原来的页面,能保证动态的路由渲染好再进入页面

        store.commit('user/setRoutes', filterList)
        router.addRoutes(filterList)
        console.log(filterList, 'filterList')
        console.log(roles, 'roles')
        next(to.path)
        // await store.dispatch('user/getInfo') // 触发actives的获取用户信息方法
      } else {
        next() // 放行了才会执行前置路由守卫
      }
    }
  } else {
    if (whiteList.includes(to.path)) {
      console.log('在白名单内，放行')
      next()
    } else {
      console.log('不在白名单内，去登录页')
      next('/login')
      NProgress.done()
    }
  }
})

router.afterEach(() => {
  // 关闭进度条
  NProgress.done()
})
